<!DOCTYPE HTML>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>加入微信群</title>
		<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
		<link rel="stylesheet" type="text/css" href="../../css/set.css" />
		<style>
			body {
				line-height: 2.5;
				background-color: #ffffff;
			}
			
			header {
				margin-top: 0rem;
			}
			
			h4 {
				color: #000000;
			}
			
			p {
				color: #999999;
			}
			
			.aui-searchbar {
				background: transparent;
			}
			
			.aui-bar {
				min-height: 6.7rem;
			}
			
			.aui-bar-nav .aui-searchbar-input {
				background-color: #ffffff;
			}
			
			.aui-bar-light .aui-searchbar-input {
				background-color: #f5f5f5;
			}
			
			.aui-bar-nav,
			.aui-btn {

				color: #FFFFFF;
				background: -webkit-linear-gradient(left top, #0F9BEB, #1569C8);
				/* Safari 5.1 - 6.0 */
				background: -o-linear-gradient(bottom right, #0F9BEB, #1569C8);
				/* Opera 11.1 - 12.0 */
				background: -moz-linear-gradient(bottom right, #0F9BEB, #1569C8);
				/* Firefox 3.6 - 15 */
				background: linear-gradient(to bottom right, #0F9BEB, #1569C8);
				/* 标准的语法*/
			}
			.aui-btn{
				/*width: 15.25rem !important;*/
				margin: 0 auto;
			}
			
			.aui-bar-nav {
				/* 标准的语法*/
				top: 0;
				line-height: 2.2rem;
				background-color: #03a9f4;
				color: #ffffff;
				padding: 1rem 0 0.1rem 0;
			}
			.aui-btn-block {
				display: block;
				width: 15.25rem;
				height: 2.05rem;
				line-height: 2.05rem;
				margin-bottom: 0;
				font-size: 0.7rem;
			}
			.aui-text-center {
				text-align: center !important;
				margin-top: 2.5rem;
				margin: 0 auto;
			}
			
			.wechat_code {
				width: 15.25rem !important;
				border: 1px solid ghostwhite;
				height: 21rem;
				position: relative;
				margin: -2.15rem auto 1.7rem;
				border-radius: 18px;
				z-index: 10;
				background-color: #FFFFFF;
				box-shadow:0px 4px 10px #B2C4D8;
			}
			.aui-bar-nav .aui-btn {
				padding-left: 0.5rem !important;
				padding-right: 0.75rem !important;
				height: 2.2rem !important;
				line-height: 2.2rem !important;
				!important;
			}
			.aui-bar-nav .aui-title {
				min-height: 2.2rem !important;
				font-weight: 500 !important;

			}
			
			.wechat_code span {
				color: #1569C8;
			}
			
			img.avatar {
				padding: 0;
				margin: 2.75rem auto 1.6rem;
				width: 9.7rem;
			}
			
			img.aui-img-round {
				border-radius: 0;
				border: none;
				border: 0.15rem solid #1569c8;
				padding: 0px;
			}
			
			.aui-text-info {
				font-size: 1.25rem;
				color: #000000 !important;
			}
			
			.my_logo .logo_title {
				margin-top: 1rem;
				color: #000000;
			}
			
			.aui-card-list-footer.aui-text-center.aui-border-t {
				margin-top: 0rem;
			}
			
			.aui-card-list-header,
			.aui-card-list-footer {
				/*padding: 0rem 0.75rem;*/
			}
			
			p {
				font-size: 0.6rem;
				margin: 0px;
				color: #999999;
			}

			.aui-text-center p {
				margin: 0 auto 0.85rem;
				height: 0.4rem;
				line-height: 0.4rem;
			}
			.aui-list-item-title.logo_title {
				font-size: 0.8rem;
				height: 0.8rem;
				line-height: 0.8rem;
				margin-bottom: 1.1rem;
			}
			li.aui-text-center.copyright {
				width: 100%;
				position: absolute;
				bottom: 2rem;
			}
			 .aui-card-list-footer{
				 padding: 0 !important;
			 }
			.copyright p {
				color: #999999;
			}
			
			.aui-mask {
				z-index: 10;
				background: rgba(0, 0, 0, 0.5) !important;
			}
			
			.aui-row.aui-row-padded {
				border-top: 1px solid #1569c8;
			}
			
			.arr_down {
				color: #1569C8;
				font-size: 0.25rem;
				margin: -12px;
			}
			
			.aui-sharebox .aui-row {
				padding: 0rem 0 0 0;
			}

			p.share_title {
				height: 0.7rem;
				font-size: 0.7rem;
				line-height: 0.7rem;
				color: #000;
				margin-top: 0rem;
			}
			p.registerMess {
				margin: 0.4rem;
			}
			
			.aui-sharebox-close-btn {
				width: 100%;
				height: 2.4rem;
				line-height: 2.4rem;
				color: #757575;
				text-align: center;
				font-size: 1rem;
			}
			
			.shareTitle {
				margin-top: 0;
			}
			
			.cancel {
				line-height: 2.4rem;
			}
			span.aui-iconfont.aui-icon-left{
				display: inline-block;
				height: 1.1rem;
				width: 1.1rem;
				background-image: url("../../image/nav_back@2x.png");
				background-repeat: no-repeat;
				background-size: 1.1rem;
			}
			.aui-icon-left:before {
				content: none !important;
			}
			
			.aui-pull-right img {
				max-width: 1.1rem;
				display: block;
			}
			
			.aui-bar-nav .aui-pull-right {
				padding: 0 0.75rem !important;
			}
			span.aui-iconfont.toDw {
				width: 35px !important;
				height: 35px!important;
				border: 4px solid #1569c8 !important;
				border-top: none !important;
				border-left: none !important;
				display: inline-block !important;
				top: -1.65rem !important;
				transform: rotate(45deg);
			}
			.aui-sharebox img {
				display: block;
				width: 64px !important;
				margin: 0 auto;
				border-image:none !important;
				border-image-width: 0 !important;
			}
			.aui-sharebox.aui-grid .aui-grid-label {
				font-size: 0.6rem !important;
				line-height: 0.6rem !important;
				height: 0.6rem !important;
				color: #666666 !important;
				margin-top: 0.6rem !important;
			}
			.aui-sharebox.aui-grid [class*=aui-col-] {
				padding: 0.5rem 0;
				margin-bottom: 1.6rem !important;
			}
			.aui-sharebox-close-btn.aui-border-t.cancel {
				border-top: 0.05rem solid #ccc !important;
				color: #1569c8 !important;
				font-size: 0.8rem !important;

			}
			.aui-border-b {
				background-image: none !important;
			}
			.aui-border-t {
				border: none;
				background-image: none !important;
			}
		</style>
	</head>

	<body>
		<header class="aui-bar aui-bar-nav">
			<a href="set.html" class="aui-pull-left aui-btn">
				<span class="aui-iconfont aui-icon-left"></span>
			</a>
			<div class="aui-title">加入微信群</div>
			<!--<a class="aui-btn aui-pull-right" onclick="openSharebox()">
				<span class="aui-iconfont aui-icon-plus"></span>
			</a>-->
			<a class="aui-pull-right aui-btn btn-colect" onclick="openSharebox()">
				<img src="../../image/btn/nav_share@2x.png" />
			</a>
		</header>
		<div class="aui-content-padded aui-text-center wechat_code">
			<img src="../../image/setting_jrwxq_ewm@2x.png" class="avatar aui-img-round" />
			<div class="aui-list-item-title logo_title">诚挚邀请您加入<span>KKTOKEN</span>微信交流群</div>

			<div class="aui-card-list-footer aui-text-center aui-border-t">
				<div class="aui-text-info exch_count">
					<p>志同道合的朋友</p>
					<p>不一样的观点和意见</p>
					<p>众多行业资讯动态</p>
				</div>

			</div>
		</div>
		<div class="aui-content-padded aui-text-center">
			<div class="aui-btn aui-btn-block" tapmode>加群请先加微信××××××</div>
			<p class="registerMess">验证信息：××××××</p>
		</div>

	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/aui-sharebox.js"></script>
	<script type="text/javascript">
		apiready = function() {
			api.parseTapmode();
		}
		var sharebox = new auiSharebox();

		function openSharebox() {
			sharebox.init({

				frameBounces: true, //当前页面是否弹动，（主要针对安卓端）
				shareTitle: " <p class='arr_down'><span class='aui-iconfont toDw'></span></p><p class='share_title'><span style='color:#1569c8'>kktoken</span>微信交流群分享至:</p>",
				buttons: [{
					image: '../../image/setting_share_pyq@2x.png',
					text: '朋友圈',
					value: 'wx-circle'

				}, {
					image: '../../image/setting_share_wxhy@2x.png',
					text: '微信',
					value: 'wx' //可选
				}, {
					image: '../../image/setting_share_qqkj@2x.png',
					text: 'QQ空间',
					value: 'qq-qzone'
				}, {
					image: '../../image/setting_share_xlwb@2x.png',
					text: '新浪微博'
				}],
				col: 4,
				cancelTitle: '取&emsp;消' //可选,当然也可以采用下面的方式使用图标
				//             cancelTitle:'<i class="aui-iconfont aui-icon-close aui-font-size-16"></i>'//可选
			}, function(ret) {
				if(ret) {
					document.getElementById("button-index").textContent = ret.buttonIndex;
					document.getElementById("button-value").textContent = ret.buttonValue;
				}
			})
		}
	</script>

</html>